<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>藏酒方式</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<include file="cellar/comm" />
	</head>

	<body>
		<header class="mui-bar mui-bar-nav fs_xl">
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left fs_xxi"></a>
		    <h1 class="mui-title fs_xl">窖藏方式</h1>
		</header>
		<include file="cellar/bottom_nav" />
		<div class="jc_check fs_m">室内窖藏<i class="mui-icon mui-icon-arrowup fs_xs"></i></div>
		<div class="jc_box">
			<div class="jc_xz fs_s cls">
				<ul>
					<li class="jc_right">
						<a class=""><i class="mui-icon mui-icon-checkmarkempty fs_xi"></i><em class="fs_xs">室内窖藏</em></a>
					</li>
					<li>
						<a class=""><em class="fs_xs">地下室窖藏</em></a>
					</li>
					<li>
						<a class=""><em class="fs_xs">地理窖藏</em></a>
					</li>
					<li>
						<a class=""><em class="fs_xs">海藏</em></a>
					</li>
					<li>
						<a class=""><em class="fs_xs">洞藏</em></a>
					</li>
				</ul>
			</div>
		</div>
		<div id="pullrefresh" class="mui-content mui-scroll-wrapper bjxx fs_xl">
			<div class="mui-scroll fs_xl pr_m">
				<ul class="mui-table-view mui-table-view-chevron fs_xl">
					<li class="mui-table-view-cell fs_xl cls">
						<a class="fs_xl" href="javascript:;">
							<div class="pr_info fs_xl fr">
								<p class="fs_m">60%vol-68%vol红桃山酱香窖存酒</p>
								<p class="fs_xs"><i class="mui-icon mui-icon-eye"></i><em>成都市大邑县原产</em></p>
								<p class="fs_m"><span class="span1 fs_xxs">室内窖藏</span><span class="span2 fs_xxs">馥郁香</span></p>
								<p class="fs_m"><span class="span3 fs_xl">¥56/kg</span><span class="span4 fs_xxs">6583kg已售</span></p>
							</div>
							<div class="pr_img fs_xl fl">
								<img src="../images/banner03.png" />
							</div>
						</a>
					</li>
					<li class="mui-table-view-cell fs_xl cls">
						<a class="fs_xl" href="javascript:;">
							<div class="pr_info fs_xl fr">
								<p class="fs_m">60%vol-68%vol红桃山酱香窖存酒</p>
								<p class="fs_xs"><i class="mui-icon mui-icon-eye"></i><em>成都市大邑县原产</em></p>
								<p class="fs_m"><span class="span1 fs_xxs">室内窖藏</span><span class="span2 fs_xxs">馥郁香</span></p>
								<p class="fs_m"><span class="span3 fs_xl">¥56/kg</span><span class="span4 fs_xxs">6583kg已售</span></p>
							</div>
							<div class="pr_img fs_xl fl">
								<img src="../images/banner03.png" />
							</div>
						</a>
					</li>
					<li class="mui-table-view-cell fs_xl cls">
						<a class="fs_xl" href="javascript:;">
							<div class="pr_info fs_xl fr">
								<p class="fs_m">60%vol-68%vol红桃山酱香窖存酒</p>
								<p class="fs_xs"><i class="mui-icon mui-icon-eye"></i><em>成都市大邑县原产</em></p>
								<p class="fs_m"><span class="span1 fs_xxs">室内窖藏</span><span class="span2 fs_xxs">馥郁香</span></p>
								<p class="fs_m"><span class="span3 fs_xl">¥56/kg</span><span class="span4 fs_xxs">6583kg已售</span></p>
							</div>
							<div class="pr_img fs_xl fl">
								<img src="../images/banner03.png" />
							</div>
						</a>
					</li>
					<li class="mui-table-view-cell fs_xl cls">
						<a class="fs_xl" href="javascript:;">
							<div class="pr_info fs_xl fr">
								<p class="fs_m">60%vol-68%vol红桃山酱香窖存酒</p>
								<p class="fs_xs"><i class="mui-icon mui-icon-eye"></i><em>成都市大邑县原产</em></p>
								<p class="fs_m"><span class="span1 fs_xxs">室内窖藏</span><span class="span2 fs_xxs">馥郁香</span></p>
								<p class="fs_m"><span class="span3 fs_xl">¥56/kg</span><span class="span4 fs_xxs">6583kg已售</span></p>
							</div>
							<div class="pr_img fs_xl fl">
								<img src="../images/banner03.png" />
							</div>
						</a>
					</li>
					<li class="mui-table-view-cell fs_xl cls">
						<a class="fs_xl" href="javascript:;">
							<div class="pr_info fs_xl fr">
								<p class="fs_m">60%vol-68%vol红桃山酱香窖存酒</p>
								<p class="fs_xs"><i class="mui-icon mui-icon-eye"></i><em>成都市大邑县原产</em></p>
								<p class="fs_m"><span class="span1 fs_xxs">室内窖藏</span><span class="span2 fs_xxs">馥郁香</span></p>
								<p class="fs_m"><span class="span3 fs_xl">¥56/kg</span><span class="span4 fs_xxs">6583kg已售</span></p>
							</div>
							<div class="pr_img fs_xl fl">
								<img src="../images/banner03.png" />
							</div>
						</a>
					</li>
				</ul>
			</div>
			</div>
		<script src="../js/mui.min.js"></script>
		<script type="text/javascript" src="../js/jquery-1.8.3.min.js" ></script>
		<script>
			mui.init({
				pullRefresh: {
					container: '#pullrefresh',
					down: {
						callback: pulldownRefresh
					},
					up: {
						contentrefresh: '正在加载...',
						callback: pullupRefresh
					}
				}
			});
			/**
			 * 下拉刷新具体业务实现
			 */
			function pulldownRefresh() {
				setTimeout(function() {
					var table = document.body.querySelector('.mui-table-view');
					var cells = document.body.querySelectorAll('.mui-table-view-cell');
					for (var i = cells.length, len = i + 3; i < len; i++) {
						var li = document.createElement('li');
						li.className = 'mui-table-view-cell';
						li.innerHTML = '<a class="fs_xl" href="javascript:;">'+'<div class="pr_info fs_xl fr">'+
						'<p class="fs_m">新增加的酒'+'</p>'+
						'<p class="fs_xs">'+'<i class="mui-icon mui-icon-eye">'+'</i>'+'<em>'+'</em>成都市大邑县原产'+'</p>'+
						'<p class="fs_m">'+'<span class="span1 fs_xxs">室内窖藏'+'</span>'+'<span class="span2 fs_xxs">馥郁香'+'</span>'+'</p>'+
						'<p class="fs_m">'+'<span class="span3 fs_xl">¥56/kg'+'</span>'+'<span class="span4 fs_xxs">6583kg已售'+'</span>'+'</p>'+
						'</div>'+
						'<div class="pr_img fs_xl fl">'+'<img src="../images/banner03.png" />'+'</div>'+
						'</a>';
						//下拉刷新，新纪录插到最前面；
						table.insertBefore(li, table.firstChild);
					}
					mui('#pullrefresh').pullRefresh().endPulldownToRefresh(); //refresh completed
				}, 1500);
			}
			var count = 0;
			/**
			 * 上拉加载具体业务实现
			 */
			function pullupRefresh() {
				setTimeout(function() {
					mui('#pullrefresh').pullRefresh().endPullupToRefresh((++count > 2)); //参数为true代表没有更多数据了。
					var table = document.body.querySelector('.mui-table-view');
					var cells = document.body.querySelectorAll('.mui-table-view-cell');
					for (var i = cells.length, len = i + 5; i < len; i++) {
						var li = document.createElement('li');
						li.className = 'mui-table-view-cell';
						li.innerHTML = '<a class="fs_xl" href="javascript:;">'+'<div class="pr_info fs_xl fr">'+
						'<p class="fs_m">以前的酒'+'</p>'+
						'<p class="fs_xs">'+'<i class="mui-icon mui-icon-eye">'+'</i>'+'<em>'+'</em>成都市大邑县原产'+'</p>'+
						'<p class="fs_m">'+'<span class="span1 fs_xxs">室内窖藏'+'</span>'+'<span class="span2 fs_xxs">馥郁香'+'</span>'+'</p>'+
						'<p class="fs_m">'+'<span class="span3 fs_xl">¥56/kg'+'</span>'+'<span class="span4 fs_xxs">6583kg已售'+'</span>'+'</p>'+
						'</div>'+
						'<div class="pr_img fs_xl fl">'+'<img src="../images/banner03.png" />'+'</div>'+
						'</a>';
						table.appendChild(li);
					}
				}, 1500);
			}
//			if (mui.os.plus) {
//				mui.plusReady(function() {
//					setTimeout(function() {
//						mui('#pullrefresh').pullRefresh().pullupLoading();
//					}, 10);
//
//				});
//			} else {
//				mui.ready(function() {
//					mui('#pullrefresh').pullRefresh().pullupLoading();
//				});
//			}
			$(function(){
				var jc_top=$(".jc_check").height()+$("header").height();
				$(".jc_box").height($(window).height()-$(".jc_check").height()-$("header").height());
				$(".jc_box").css("top",jc_top);
				$(".jc_check").toggle(function(){
					$(".jc_box").hide();
					$(".jc_check i").addClass("mui-icon-arrowdown");
				},function(){
					$(".jc_box").show();
					$(".jc_check i").removeClass("mui-icon-arrowdown");
				});
				$(".jc_xz li").click(function(){
					if($(this).find("i").length<=0){
						$(this).addClass("jc_right").siblings().removeClass("jc_right");
						$(this).find("a").prepend('<i class="mui-icon mui-icon-checkmarkempty fs_xi"></i>');
						$(this).siblings().find("i").remove();
					}
				});
			})
		</script>
	</body>

</html>